//商家信息列表
var users = new Vue({
  el: "#users",
  data: {
    users: [],
    isModifying: [],
    currentSearchPattern: "",
    matchusers: [],
    isSearching: false,
    isAdding: false
  },
  methods: {
    addItem: function() {
      this.isAdding = true;
      console.log("add item");
      this.$http.get(SERVER_PORT + "requestAllUser").then(response => {
        this.users = Object.assign([], response.data.data);
        for (let i = 0; i < this.users.length; i++) {
          this.isModifying.push(false);
        }
        this.users.unshift({});
        this.isModifying.unshift(true);
        this.isAdding = false;
      });
    },
    modifyItem: function(index) {
      console.log("change item " + index + " to modifying state");
      this.$set(this.isModifying, index, true);
    },
    submitItem: function(index) {
      Ply.dialog("confirm", "确定提交?").done(function() {
        console.log("submit item " + index);
        users.setUserInfo(index, null, function(response) {
          if (response.data.status === 1) {
            Ply.dialog("alert", "修改成功！");
            users.users[index].active = "否";
          } else {
            Ply.dialog("alert", "修改失败，请重试！");
          }
        });
        console.log(users.users);
        Vue.set(users.isModifying, index, false);
      });
    },
    setUserInfo: function(index, data, callback) {
      let tempUser = Object.assign({}, users.users[index], data);
      Vue.http
      .post(
        SERVER_PORT + "modifyUser",
        {
          phone: tempUser.phone,
          password:tempUser.password,
          nickname:tempUser.nickname,
          gender:tempUser.gender,
          profile:tempUser.profile,
          active:tempUser.active,
        },
        { emulateJSON: true }
      )
      .then(response => {
        callback(response);
      });
    },
    setActiveState: function(index, isActive, callback) {
      this.setUserInfo(index, {active: isActive ? "是" : "否"}, callback);
    },
    freezeItem: function(index) {
      Ply.dialog("confirm", "确定冻结?").done(function() {
        console.log("freeze item " + index);
        users.setActiveState(index, false, function(response) {
          if (response.data.status === 1) {
            Ply.dialog("alert", "冻结成功！");
            users.users[index].active = "否";
          } else {
            Ply.dialog("alert", "冻结失败，请重试！");
          }
        });
      });
    },
    unfreezeItem: function(index) {
      Ply.dialog("confirm", "确定解冻?").done(function() {
        console.log("freeze item " + index);
        users.setActiveState(index, true, function(response) {
          if (response.data.status === 1) {
            Ply.dialog("alert", "解冻成功！");
            users.users[index].active = "是";
          } else {
            Ply.dialog("alert", "解冻失败，请重试！");
          }
        });
      });
    },
    deleteItem: function(index) {
      Ply.dialog("confirm", "确定删除?").done(function() {
        console.log("delete item " + index);
        Vue.http
          .post(
            SERVER_PORT + "deleteUser",
            {
              phone: users.users[index].phone
            },
            { emulateJSON: true }
          )
          .then(response => {
            if (response.data.status === 1) {
              Ply.dialog("alert", "删除成功！");
              users.users.splice(index, 1);
              users.isModifying.splice(index, 1);
            } else {
              Ply.dialog("alert", "删除失败，请重试！");
            }
          });
      });
    },
    requsetAllDataFromServer: function() {
      this.$http.get(SERVER_PORT + "requestAllUser").then(response => {
        console.log(response.data.data);
        //this.$set(this.users,response);\
        this.users = Object.assign([], response.data.data);
        for (let i = 0; i < this.users.length; i++) {
          this.isModifying.push(false);
        }
      });
    },
    performSearch: function() {
      this.isSearching = true;
      this.$http.get(SERVER_PORT + "requestAllUser").then(response => {
        this.users = Object.assign([], response.data.data);
        for (let i = 0; i < this.users.length; i++) {
          this.isModifying.push(false);
        }
        if (this.currentSearchPattern !== "") {
          this.matchusers = [];
          for (let seller of this.users) {
            for (let attr in seller) {
              if (attr === "store_ID") continue;
              if (seller[attr].toString().match(this.currentSearchPattern)) {
                this.matchusers.push(seller);
                break;
              }
            }
          }
          this.users = Object.assign([], this.matchusers);
          this.isModifying = Object.assign([], []);
          for (let i = 0; i < this.matchusers.length; i++) {
            this.isModifying.push(false);
          }
        }
        this.isSearching = false;
      });
    },
    getUserProfile: function(user) {
      if (user.profile === "default") {
        return "../img/base/avatar-default.png";
      }
      return user.profile;
    },
    isFrozen: function(user) {
      return !user.active;
    }
  },
  created: function() {
    console.log("enter");
    this.requsetAllDataFromServer();
  }
});
